﻿<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" trimDirectiveWhitespaces="true" language="java" pageEncoding="utf-8" %>

<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-cache"/>
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="description" content="">
    <link rel="stylesheet" type="text/css" href="lib/bootstrap/3.3.7/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" media="screen" href="lib/jqgrid/5.2.1/css/ui.jqgrid-bootstrap.css"/>
    <link rel="stylesheet" type="text/css" media="screen" href="css/mycss.css"/>
    <title>今日业务概览</title>
</head>
<body>

<div class="container-fluid">
    <div class="page-header">
        <h3>今日业务概览</h3>
    </div>
    <table id="businessOverviewJQGrid"></table>
    <div style="height: 40px" id="businessOverviewJQGridPager"></div>
</div>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.11.0/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="lib/bootstrap/3.3.7/js/bootstrap.js"></script>
<script type="text/javascript" src="lib/jqgrid/5.2.1/js/i18n/grid.locale-cn.js"></script>
<script type="text/javascript" src="lib/jqgrid/5.2.1/js/jquery.jqGrid.min.js"></script>
<!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript">
    $(function () {
        $.jgrid.defaults.responsive = true;
        $.jgrid.defaults.styleUI = "Bootstrap";
        $("#businessOverviewJQGrid").jqGrid({
            height:434,
            autowidth:true,
            shrinkToFit:true,/*  autoScroll: false, *//*forceFit: true, */
            colNames:["主键", "业务名称", "总呼叫数量", "已处理呼叫数量", "未处理呼叫数量", "业务创建时间"],
            colModel:[
                {name: "business_id", index: "business_id", key: true, hidden: true},
                {name: "business_name", index: "blacklist_name", align: "left"},
                {name: "total_count", index: "end_task_count", align: "left"},
                {name: "finish_count", index: "remain_task_count", align: "left"},
                {name: "not_finish_count", index: "end_call_count", align: "left"},
                {name: "create_time", index: "create_time", align: "left"}
            ],
            pager:"#businessOverviewJQGridPager",
            viewrecords:true,
            hidegrid:false,
            multiselect: false,
            url:"overview/getBusinessProcessInfo.do",
            datatype:'json',
            rownumbers: true,
            rowNum : 30,
            rowList: [15, 30, 50],
            jsonReader: {
                root: "dataList", page: "currPage", total: "totalPages",          //   很重要 定义了 后台分页参数的名字。
                records: "totalCount", repeatitems: false, id : "business_id"
            }


        });
    });


</script>
</body>
</html>